<template>
  <div class="table-head">
    <el-row :gutter="8">
      <el-col :span="16">
        <v2-form v-if="config.searchColumns.length>0" :fields="config.searchColumns" :form-data="formData" ref="v2Form" :hide-button="true"></v2-form>
      </el-col>
      <el-col :span="8">
        <el-button-group class="pd-tb-10-px text-right">
          <el-button :type="btn.btnType || 'primary'" :icon="btn.icon"
                     size="small"
                     v-for="(btn ,index) in config.buttons" @click="buttonClickHandler(btn ,index)">{{btn.title}}</el-button>
        </el-button-group>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import commons from "utils/commons";

export default {
  name: "TableHead",
  props:{
    config:{
      type: Object,
      default:()=>{
        return {}
      }
    },
  },
  data(){
    return {
      formData:{}
    }
  },
  methods:{
    buttonClickHandler(btn,index){
      if(commons.isFun(btn.callback)){
        btn.callback()
      }else{
        // newAdd
        // search
        if(btn.type === "reset"){// reset
          this.$refs.v2Form.resetFields()
        }else{
          this.$emit(btn.type , {
            button: btn,
            formData:this.formData
          }) ;
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
